.book-details
    @include border(l, 4px solid var(--text-meta))
    @include radius
    display: block
    overflow: hidden
    margin: 1rem 0
    background: var(--bg-blk)
    box-shadow: var(--shdw-bold)

    summary
        @include font(14px, bold, --text-p2)
        cursor: pointer
        padding: .3rem .5rem

        &::marker,
        &::-webkit-details-marker
            content: "" !important

        img
            @include transition(transform .2s ease)
            vertical-align: bottom
            float: left
            width: 19px
            height: 19px
            margin-right: 5px

    .inner
        @include trim()
        padding: 1rem
        background: var(--bg-card)
        overflow: hidden

    &[open]
        & > summary
            @include border(b)
            img
                transform: rotate(90deg)
